基本應用

在前面的許多範例裡，都會使用到 form 來觸發 AJAX，HTMX 中跟隨原生的 form 操作方式，觸發 submit 時，所有 form 裡面的輸入欄位會依照 name 的屬性值來做為欄位名稱。（GET 方法不會有值）

hx-include

hx-include 這個屬性可以設置 CSS 選擇器讓 AJAX 的請求包含其他輸入欄位，範例如下：

<div>
    <button hx-post="/register" hx-include="[name='email']">
        Register!
    </button>
    Enter email: <input name="email" type="email"/>
</div>

上面的範例並沒有使用 form，而是直接使用 hx-include 來指定需要的欄位和值。

如果 hx-include 選擇到的元素不是一個輸入元素，則會使用這個元素底下所有輸入元素的欄位和值，例如：指定一個包含三個 input 的 div，則取得三個 input 的欄位和值。

hx-params

與上面相反，hx-params 用來過濾要加入的欄位和值，以下是可以設置的屬性：

• • : 預設值，使用所有選到的欄位值。
• none: 全部都不要。
• <param-list>: 包含 param-list 裡面列出的欄位（使用逗點分隔）。
• not <param-list> - 排除 param-list 裡面列出的欄位（使用逗點分隔）。

<div hx-get="/example" hx-params="*">
    Get Some HTML, Including Params
</div>

上方範例會把所有取得的參數當做 query 加到 GET 請求中。

參考資料：https://htmx.org/docs/#parameters